/* eslint-disable */
import React from "react";
import Chart from "echarts-for-react";
import style from "./Echarts_tu.less";
import request from '../../../utils/request';


class Echarts_left3 extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            xianzhi: 0,
            time:[],
            series:[]
        }



    }

    componentDidMount() {
        request({
            url: `/sx-client/sx/indicator/environmentalEmission?number=1`,
            method: 'GET',
        }).then(data => {
            if (data.rc === 0) {

                let arr = []

                data.ret.list.forEach(item => {
                    arr.push({
                        name: item.name,
                        type: 'bar',
                        data: item.value,
                        barWidth: 10, //柱子宽度
                        barGap: 1, //柱子之间间距
                    },)
                });

                this.setState({
                    time: data.ret.time,
                    series:arr
                })

            }
        })

    }




    setOption = () => {

        return {
            // backgroundColor: '#00265f',
            tooltip: {
                trigger: 'axis',
                axisPointer: {
                    type: 'shadow'
                }
            },
            grid: {
                left: '3%',
                right: '4%',
                bottom: '3%',
                containLabel: true
            },
            xAxis: [{
                type: 'category',
                data: this.state.time,
                axisLine: {
                    show: true,
                    lineStyle: {
                        color: "#063374",
                        width: 1,
                        type: "solid"
                    }
                },
                axisTick: {
                    show: false,
                },
                axisLabel: {
                    show: true,
                    textStyle: {
                        color: "#00c7ff",
                    }
                },
            }],
            yAxis: [{
                type: 'value',
                axisLabel: {
                    formatter: '{value} %'
                },
                axisTick: {
                    show: false,
                },
                axisLine: {
                    show: false,
                    lineStyle: {
                        color: "#00c7ff",
                        width: 1,
                        type: "solid"
                    },
                },
                splitLine: {
                    lineStyle: {
                        color: "#063374",
                    }
                }
            }],
            series:this.state.series
        };




    }

    render() {
        console.log(this.props)
        return (

            <Chart option={this.setOption()} notMerge lazyUpdate
                style={{ height: '100%' }}
            />




        );
    }

}

export default Echarts_left3;
